<template>
  <HeadTabar :title="title"/>
  <Banner/>
  <view>
    <view class="content">- 优选服务 - </view>
    <view class="content" v-for="(option,index) in options" :key="index">
    <navigator
      :url="option.url"
      open-type="navigate"
      hover-class="navigator-hover"
    >
    <button class="custom-button" :style="{backgroundColor: option.button_color,color:option.font_color}">
      <text class="button_text">{{ option.name }}</text>
    </button>
    </navigator>
  </view>
  </view>
  
</template>

<script setup lang="ts">
import HeadTabar from '@/components/headTabar.vue'
import Banner from './components/banner.vue'
import { ref,reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import {useMemberStore} from '@/stores/modules/member'
import {getUserInfoApi} from '@/apis/user/user'
onLoad( async ()=>{
  const memberStore = useMemberStore()
  if(memberStore.token!='')
  {
    const isTokenOutTimeRes = await getUserInfoApi()
    if(isTokenOutTimeRes.code == 400||isTokenOutTimeRes.code == 401||isTokenOutTimeRes.code == 402){
      memberStore.cleanUserInfo()//token已过期需要重新登录
    }
  }
  if(memberStore.token=='')
  {
    //弹窗提示用户登录
    uni.showModal({
    content: '请先登录！',
    success: (res) => {
      if (res.confirm) {
        uni.switchTab({
          url:'/pages/my/my',
        })
      }
    },
  })
  }
})
const options = reactive([
  {
    id:1,
    name:'跌倒风险自我评估表',
    button_color:'rgb(255,238,237)',
    url:'/pages/fallRiskSelf/fallRiskSelf',
    font_color:'rgb(255,117,102)',
    icon:'iconfont icon-zhidingpinggubiao'
  },
  {
    id:2,
    name:'跌倒风险筛查清单',
    button_color:'rgb(231,238,255)',
    url:'/pages/fallRiskList/fallRiskList',
    font_color:'rgb(13,82,255)',
    icon:'iconfont icon-qingdan'
  },
  {
    id:3,
    name:'学习模块',
    button_color:'rgb(255,241,230)',
    url:'/pages/study/study',
    font_color:'rgb(255,157,28)',
    icon:'iconfont icon-xuexi'
  },
  {
    id:4,
    name:'查看历次风险报告',
    button_color:'rgb(255,238,237)',
    url:'/pages/fallRiskReports/fallRiskReports',
    font_color:'rgb(255,117,102)',
    icon:'iconfont icon-tijianbaogao'
  },
  {
    id:5,
    name:'历史风险自我评估表',
    button_color:'rgb(231,238,255)',
    url:'/pages/historyFallRiskSelf/historyFallRiskSelf',
    font_color:'rgb(13,82,255)',
    icon:'iconfont icon-zhidingpinggubiao'
  },
  {
    id:6,
    name:'查看个人干预措施',
    button_color:'rgb(255,241,230)',
    url:'/pages/myInterventions/myInterventions',
    font_color:'rgb(255,157,28)',
    icon:'iconfont icon-jijiucuoshi'
  }
])
const title = ref('临床防跌倒实践预防系统')

</script>

<style scoped lang="scss">
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; 
  padding: 15rpx;
.custom-button{ 
  width: 600rpx;  
  height: 100rpx;  
}
}
/* .logo {
  height: 200rpx;
  width: 200rpx;
  margin-top: 200rpx;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50rpx;
}

.text-area {
  display: flex;
  justify-content: center;
}

.title {
  font-size: 36rpx;
  color: #8f8f94;
} */
</style>
